<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title></title>

    <link href="/styles/base.css" rel="stylesheet" type="text/css">
    <link href="/styles/destfilter.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="/js/jquery.js"></script>
    <script type="text/javascript" src="/js/destfilter.js"></script>
    <script type="text/javascript" src="/js/common.js"></script>
    <script>
        $(function () {
            function GetQueryString(name)
            {
                var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
                var r = window.location.search.substr(1).match(reg);
                if(r!=null)return  unescape(r[2]); return null;
            }

            var themeId = GetQueryString("themeId");
            $("#total a[data-id="+themeId+"]").addClass('on');
            $('.container').click(function () {
                //选中所有被选中的对象
                var on = $('.on');
                var arry = new Array();
                on.each(function () {
                    var data = $(this).data('id');
                    arry.push(data);
                });
                var monthId = arry[0];
                var themesId = arry[1];
                var daysId = arry[2];
                $.post('/destination/travelFilterTpl',
                    {themeId:themeId,monthId:monthId,themesId:themesId,daysId:daysId},
                        function (data) {
                            $('#destFilterTpl').html('');
                            $('#destFilterTpl').html(data)
                        }
                )
            });
        })
    </script>
</head>

<body>
     <#assign currentNav="index">
    <#include "../common/navbar.ftl">

    <div class="container">
        <div class="row-top">
            <div class="wrapper">
                <div class="top-bar">
                    <div class="crumb">
                        <div class="item"><a href="javascript:;" target="_blank">目的地</a><em>&gt;</em></div>
                        <div class="item cur">目的地筛选</div>
                    </div>
                </div>
                <div class="filter-title">目的地筛选</div>
                <div class="filter-nav">
                    <dl class="clearfix">
                        <dt>时间</dt>
                        <dd class="J_dd">
                            <div class="month clearfix">
                                <a  id="time" class="on" href="javascript:void(0)" onclick="t0();" data-id="-1">不限</a>
                                <script>
                                    t0 = function () {
                                        $(".month a").removeClass();
                                        $('#festivals a').removeClass();
                                        $("#time").addClass('on');
                                    }
                                </script>
                                <#--<#list month as m>
                                    &lt;#&ndash;<a id="month" href="/destination/travelFilter?RecommendId=${m.id!}&themeId=${themeId!}">${m.name!}</a>&ndash;&gt;
                                    <a id="month" href="javascript:void(0)" data-id="104">${m.name!}</a>
                                </#list>-->
                                <#list month as m>
                                     <a href="javascript:void(0);" id="type-filter${m.id}" data-id="${m.id}"
                                        data-value="${m.name}" class=""
                                        onclick="t${m.id}();">${m.name}</a>
                                     <script>
                                         t${m.id} = function () {
                                             $(".month a").removeClass();
                                             $(".festival a").removeClass();
                                             $("#type-filter${m.id}").addClass('on');
                                         }
                                     </script>
                                </#list>

                            </div>
                            <div class="festival clearfix" id="festivals">
                                <#list festival as f>
                                     <a href="javascript:void(0);" id="type-filter${f.id}" data-id="${f.id}"
                                        data-value="${f.name}" class=""
                                        onclick="t${f.id}();">${f.name}</a>
                                     <script>
                                         t${f.id} = function () {
                                             $(".festival a").removeClass();
                                             $(".month a").removeClass();
                                             $("#type-filter${f.id}").addClass('on');
                                         }
                                     </script>
                                </#list>


                               <#--<#list festival as f>
                                   <a id="festival" href="/destination/travelFilter?FestivalId=${f.id!}&themeId=${themeId!}">${f.name!}</a>
                               </#list>-->
                                <a href="javascript:void(0)" data-id="104" id="ccc">清明</a>
                                <a href="javascript:void(0)" data-id="83">五一</a>
                                <a href="javascript:void(0)" data-id="86">端午</a>
                                <a href="javascript:void(0)" data-id="89">中秋</a>
                                <a href="javascript:void(0)" data-id="92">国庆</a>
                                <a href="javascript:void(0)" data-id="107">寒假</a>
                                <a href="javascript:void(0)" data-id="110">暑假</a>
                            </div>
                        </dd>
                    </dl>
                    <dl class="clearfix">
                        <dt>主题</dt>
                        <dd class="J_dd" id="dd">
                            <a id="clearfix" class="" href="javascript:void(0)" onclick="tt();" data-id="-1">不限</a>
                            <script>
                                tt = function () {
                                    $("#dd a").removeClass();
                                    $("#clearfix").addClass('on');
                                }
                            </script>
                            <div class="sub-nav">
                                <dl class="clearfix" id="total">
                                    <dt>全年适宜：</dt>
                                    <dd>
                                       <#-- <#list themes as t>
                                            <a id="themes" href="javascript:void(0)${t.id!}" class="">${t.name!}</a>
                                        </#list>-->
                                    <#list themes as t>
                                     <a href="javascript:void(0);" id="type-filter${t.name}" data-id="${t.id}"
                                        data-value="${t.name}" class=""
                                        onclick="t${t.name}();">${t.name}</a>
                                     <script>
                                         t${t.name} = function () {
                                             $("#dd a").removeClass();
                                             $("#type-filter${t.name}").addClass('on');
                                         }
                                     </script>
                                     </#list>
                                    </dd>
                                </dl>
                                <dl class="clearfix">
                                    <dt>季节：</dt>
                                    <dd>
                                        <a href="javascript:void(0)" data-id="50">草原</a>
                                        <a href="javascript:void(0)" data-id="98">星空</a>
                                        <a href="javascript:void(0)" data-id="35">赏花</a>
                                        <a href="javascript:void(0)" data-id="68">雪景</a>
                                        <a href="javascript:void(0)" data-id="59">海岛</a>
                                        <a href="javascript:void(0)" data-id="38">极限运动</a>
                                        <a href="javascript:void(0)" data-id="56">滑雪</a>
                                        <a href="javascript:void(0)" data-id="53">温泉</a>
                                        <a href="javascript:void(0)" data-id="32">当地节庆</a>
                                        <a href="javascript:void(0)" data-id="71">温暖地点</a>
                                        <a href="javascript:void(0)" data-id="170">避暑</a>
                                        <a href="javascript:void(0)" data-id="181">极光</a>
                                    </dd>
                                </dl>
                                <dl class="clearfix">
                                    <dt>出行方式：</dt>
                                    <dd>
                                        <a href="javascript:void(0)" data-id="14">徒步</a>
                                        <a href="javascript:void(0)" data-id="29">自驾</a>
                                        <a href="javascript:void(0)" data-id="62">游轮</a>
                                        <a href="javascript:void(0)" data-id="74">骑行</a>
                                        <a href="javascript:void(0)" data-id="5">蜜月</a>
                                        <a href="javascript:void(0)" data-id="8">亲子游</a>
                                        <a href="javascript:void(0)" data-id="11">带父母</a>
                                        <a href="javascript:void(0)" data-id="161">一个人</a>
                                        <a href="javascript:void(0)" data-id="95">好朋友</a>
                                    </dd>
                                </dl>
                            </div>
                        </dd>
                    </dl>
                    <dl class="clearfix">
                        <dt>天数</dt>
                        <dd class="J_dd" id="bbc">
                            <a id="num" class="on" href="javascript:void(0)" data-id="-1" onclick="ts( );">不限</a>
                            <script>
                                ts=function () {
                                    $("#bbc a").removeClass();
                                    $('#num').addClass('on');
                                }
                            </script>
                            <#--<#list days as d>
                                <a id="days" href="javascript:void(0)" data-id="149">${d.name!}</a>
                            </#list>-->

                            <#list days as d>
                                     <a href="javascript:void(0);" id="type-filter${d.id}" data-id="${d.id}"
                                        data-value="${d.name}" class=""
                                        onclick="t${d.id}();">${d.name}</a>
                                     <script>
                                         t${d.id} = function () {
                                             $("#bbc a").removeClass();
                                             $("#type-filter${d.id}").addClass('on');
                                         }
                                     </script>
                            </#list>
                        </dd>
                    </dl>
                </div>
            </div>
        </div>
        <div class="row-list">
            <div class="wrapper" id="destFilterTpl">
                <ul class="clearfix">
                    <#list details as d>
                        <li class="item">
                            <div class="img">
                                <a  href="javascript:;" target="_blank"><img height="200" width="320" src=${d.coverUrl!} style="display: inline;">
                                    <div class="title">${d.dest.name!}</div>
                                </a>
                            </div>
                            <div class="info">
                                <p class="detail">${d.title!}</p>
                                <div class="hot">
                                    <span class="label">TOP3</span>
                                    <#list d.strategyDetails as sds>
                                        <a href="javascript:;" target="_blank">${sds.catalog.name!}</a>
                                        <span class="divide"></span>
                                    </#list>
                                </div>

                                <div class="line"><a href="javascript:;" target="_blank"><em>1</em>${d.subTitle!}</a></div>
                            </div>
                        </li>
                    </#list>
                </ul>
            </div>
        </div>
    </div>
    <div id="footer">
        <div class="ft-content" style="width: 1105px">
            <div class="ft-info clearfix">
                <dl class="ft-info-col ft-info-intro">
                    <dt>马蜂窝旅游网</dt>
                    <dd>叩丁狼是一家专注于培养高级IT技术人才，为学员提供定制化IT职业规划方案及</dd>
                    <dd>意见咨询服务的教育科技公司，为您提供海量优质课程，以及创新的线上线下学</dd>
                    <dd>习体验，帮助您获得全新的个人发展和能力提升。</dd>
                </dl>
                <dl class="ft-info-col ft-info-qrcode">
                    <dd>
                        <span class="ft-qrcode-tejia"></span>
                    </dd>
                    <dd>
                        <span class="ft-qrcode-weixin"></span>
                    </dd>
                    <dd>
                        <span class="ft-qrcode-weixin" style="background-image: url('https://p3-q.mafengwo.net/s10/M00/48/A9/wKgBZ1t_4sSAVJ6uAAAlzJ0PZgU881.png?imageMogr2%2Fthumbnail%2F%2194x90r%2Fgravity%2FCenter%2Fcrop%2F%2194x90%2Fquality%2F90')"></span>
                    </dd>
                </dl>
                <dl class="ft-info-social">
                    <dt>向崇尚自由的加勒比海盗致敬！</dt>
                    <dd>
                        <a class="ft-social-weibo" target="_blank" href="javascript:;" rel="nofollow"><i
                                class="ft-social-icon"></i></a>
                        <a class="ft-social-qqt" target="_blank" href="javascript:;" rel="nofollow"><i
                                class="ft-social-icon"></i></a>
                        <a class="ft-social-qzone" target="_blank" href="javascript:;" rel="nofollow"><i
                                class="ft-social-icon"></i></a>
                    </dd>
                </dl>
            </div>

            <div class="ft-links">
                <a target="_blank" href="http://china.makepolo.com/">马可波罗</a><a target="_blank" href="http://www.onlylady.com/">Onlylady女人志</a><a target="_blank" href="http://trip.elong.com/">艺龙旅游指南</a><a target="_blank" href="http://www.cncn.com">欣欣旅游网</a>
                <a target="_blank" href="http://www.8264.com/">户外运动</a><a target="_blank" href="http://www.yue365.com/">365音乐网</a><a target="_blank" href="http://ishare.iask.sina.com.cn/">爱问共享资料</a><a target="_blank" href="http://www.uzai.com/">旅游网</a>
                <a target="_blank" href="http://www.zongheng.com/">小说网</a>
                <a target="_blank" href="http://www.xuexila.com/">学习啦</a><a target="_blank" href="http://www.yododo.com">游多多自助游</a><a target="_blank" href="http://www.zhcpic.com/">问答</a><a target="_blank" href="http://huoche.mafengwo.cn/">火车时刻表</a>
                <a target="_blank" href="http://www.lvmama.com">驴妈妈旅游网</a>
                <a target="_blank" href="http://www.haodou.com/">好豆美食网</a><a target="_blank" href="http://www.taoche.com/">二手车</a><a target="_blank" href="http://www.lvye.cn">绿野户外</a><a target="_blank" href="http://www.tuniu.com/">途牛旅游网</a>
                <a target="_blank" href="http://www.mapbar.com/">图吧</a>
                <a target="_blank" href="http://www.chnsuv.com">SUV联合越野</a><a target="_blank" href="http://www.uc.cn/">手机浏览器</a><a target="_blank" href="http://sh.city8.com/">上海地图</a><a target="_blank" href="http://www.tianqi.com/">天气预报查询</a>
                <a target="_blank" href="http://www.ly.com/">同程旅游</a>
                <a target="_blank" href="http://www.tieyou.com/">火车票</a><a target="_blank" href="http://www.yunos.com/">YunOS</a><a target="_blank" href="http://you.ctrip.com/">携程旅游</a><a target="_blank" href="http://www.jinjiang.com">锦江旅游</a>
                <a target="_blank" href="http://www.huoche.net/">火车时刻表</a>
                <a target="_blank" href="http://www.tripadvisor.cn/">TripAdvisor</a><a target="_blank" href="http://www.tianxun.com/">天巡网</a><a target="_blank" href="http://www.mayi.com/">短租房</a><a target="_blank" href="http://www.zuzuche.com">租租车</a>
                <a target="_blank" href="http://www.5fen.com/">五分旅游网</a>
                <a target="_blank" href="http://www.zhuna.cn/">酒店预订</a><a target="_blank" href="http://www.ailvxing.com">爱旅行网</a><a target="_blank" href="http://360.mafengwo.cn/all.php">旅游</a><a target="_blank" href="http://vacations.ctrip.com/">旅游网</a>
                <a target="_blank" href="http://www.wed114.cn">wed114结婚网</a>
                <a target="_blank" href="http://www.chexun.com/">车讯网</a><a target="_blank" href="http://www.aoyou.com/">遨游旅游网</a><a target="_blank" href="http://www.91.com/">手机</a>
                <a href="javascript:;" target="_blank">更多友情链接&gt;&gt;</a>
            </div>
        </div>
    </div>
    <div class="mfw-toolbar" id="_j_mfwtoolbar" style="display: block;">
        <div class="toolbar-item-top" style="display: none;">
            <a role="button" class="btn _j_gotop">
                <i class="icon_top"></i>
                <em>返回顶部</em>
            </a>
        </div>
        <div class="toolbar-item-feedback">
            <a role="button" data-japp="feedback" class="btn">
                <i class="icon_feedback"></i>
                <em>意见反馈</em>
            </a>
        </div>
        <div class="toolbar-item-code">
            <a role="button" class="btn">
                <i class="icon_code"></i>
            </a>
            <a role="button" class="mfw-code _j_code">


                <img src="https://p1-q.mafengwo.net/s1/M00/6C/51/wKgIC1t_6TuASybrAADGUPUHjr021.jpeg?imageMogr2%2Fthumbnail%2F%21450x192r%2Fgravity%2FCenter%2Fcrop%2F%21450x192%2Fquality%2F90"
                    width="450" height="192">
            </a>
            <!--<div class="wx-official-pop"><img src="http://images.mafengwo.net/images/qrcode-weixin.gif"><i class="_j_closeqrcode"></i></div>-->
        </div>

    </div>
</body>

</html>